import './error.less';

import { ExclamationCircleOutlined } from '@ant-design/icons';
import { history } from '@umijs/max';
import { Button, Modal, Space } from 'antd';

import bg403 from '@/assets/403bg.svg';

function Error403(props) {
  // 退出登录
  function logout() {
    Modal.confirm({
      icon: <ExclamationCircleOutlined />,
      title: '提示',
      content: '确定退出登录？',
      onOk() {
        setTimeout(() => {
          history.replace('/Login'); // 跳转到登录页
        }, 200);
      },
      onCancel() {},
    });
  }

  return (
    <div
      className="page403"
      style={{ background: 'url(' + bg403 + ') 10% 30% no-repeat' }}
    >
      <div className="info-text">
        <h1
          style={{
            fontSize: 78,
            fontWeight: 'bold',
            marginBottom: 20,
          }}
        >
          403
        </h1>
        <div
          style={{
            marginBottom: 30,
            color: '#808695',
            fontSize: 20,
            lineHeight: '28px',
          }}
        >
          抱歉，你无权限访问此页面
        </div>
        <Space>
          <Button
            onClick={() => {
              history.push('/home');
            }}
            type="primary"
          >
            返回首页
          </Button>
        </Space>
      </div>
    </div>
  );
}

// 包裹全局缓存状态
export default (props) => {
  return <Error403 {...props}></Error403>;
};
